@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Roboto:wght@300;400;500;700&display=swap');

body,
p,
span,
div,
li,
a,
button {
    font-family: 'Roboto', sans-serif;
}

.bebas h1,
.bebas h2,
.bebas h3,
.bebas span,
.bebas div {
    font-family: 'Bebas Neue', sans-serif !important;
}

/* TÍTULO DO FORMULÁRIO */

.zpform-container h2::before{
    content: "GET STARTED — IT'S FREE";
    display: block;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #A8E063;

    background: transparent !important;
    background-color: transparent !important;

    margin-bottom: 16px;
    padding: 0;
}

.zpform-container h2{
    display: flex;
    flex-direction: column;
}

.zpform-container h2{
    font-family: 'Bebas Neue', sans-serif !important;
    font-size: 42px !important;
    font-weight: 400 !important;
    color: #FFFFFF !important;
    line-height: 1.1 !important;
}

/* TEXTO ABAIXO DO BOTÃO */

.zpform-container form::after{
    content:
    "No spam. No strings attached.\A\A"
	"✓ Free, always\00A0\00A0\00A0\00A0✓ No commitment\00A0\00A0\00A0\00A0✓ 1 business day response";

    display:block;

    text-align:center;
    white-space:pre-line;

    font-family:'Roboto',sans-serif;
    font-size:12px;
    line-height:1.8;
    color:rgba(255,255,255,.70);

    margin-top:20px;
    padding-top:16px;

    border-top:1px solid rgba(127,209,113,.20);
}

.zpform-container h2{
    display: flex;
    flex-direction: column;
}

.zpform-container h2{
    font-family: 'Bebas Neue', sans-serif !important;
    font-size: 42px !important;
    font-weight: 400 !important;
    color: #FFFFFF !important;
    line-height: 1.1 !important;
}

/* SUBTÍTULO */
.zpform-info .zpaccessibility-form-desc,
.zpform-info p,
p[id*="zpformdescription"]{
    font-family: 'Roboto', sans-serif !important;
    font-weight: 400 !important;
    color: rgba(255,255,255,.75) !important;
}

/* LABELS DOS CAMPOS */
.zpform-container label{
    color: #FFFFFF !important;
    font-weight: 400 !important;
    font-family: 'Roboto', sans-serif !important;
}

/* CAMPOS */
.zpform-container input,
.zpform-container select,
.zpform-container textarea{
    color:#FFFFFF !important;
    background:rgba(255,255,255,.03) !important;
}

/* PLACEHOLDER */
.zpform-container ::placeholder{
    color: rgba(255,255,255,.55) !important;
}

/* CTA */ .cta-button{ position:relative; } .cta-button button, .cta-button a{ position:relative; overflow:hidden; isolation:isolate; } .cta-button button::before, .cta-button a::before{ content:''; position:absolute; top:0; left:-150%; width:60%; height:100%; background:linear-gradient( 120deg, transparent, rgba(255,255,255,.25), transparent ); transition:left .9s ease; } .cta-button button:hover::before, .cta-button a:hover::before{ left:150%; }

/* Card */
.health-card{
    position: relative;
    overflow: hidden;
	
    transition:
        transform .25s ease,
        box-shadow .25s ease;
}

.health-card{
    margin:8px;
}
/* Linha superior animada */
.health-card::before{
    content: "";

    position: absolute;
    top: 0;
    left: 0;

    width: 0;
    height: 3px;

    background: #7FD171;

    transition: width .25s ease;

    border-radius: 8px 8px 0 0;
}

/* Hover */
.health-card:hover{
    transform: translateY(-4px);

    box-shadow:
        0 10px 24px rgba(0,0,0,.08),
        0 4px 10px rgba(0,0,0,.04);
}

/* Anima a linha */
.health-card:hover::before{
    width: 100%;
}

/* KPI STATS */

.health-stat{
    position: relative;

    padding: 32px 24px;
    border-radius: 12px;

    background:
    radial-gradient(
        circle at top left,
        rgba(127,209,113,.15) 0%,
        rgba(127,209,113,0) 35%
    ),
    linear-gradient(
        180deg,
        #B8C9BE 0%,
        #AEBDB4 100%
    );

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        background .25s ease;
}

/* Linha superior */
.health-stat::before{
    content: "";

    position: absolute;
    top: 0;
    left: 50%;

    transform: translateX(-50%);

    width: 48px;
    height: 3px;

    border-radius: 999px;

    background: #7FD171;
}

/* Hover */
.health-stat:hover{
    transform: translateY(-6px);

    box-shadow:
        0 12px 30px rgba(0,0,0,.08),
        0 6px 16px rgba(127,209,113,.10);
}

/* cards zendeks */
.credential-card{
    background:linear-gradient(
        135deg,
        rgba(205,255,181,.25) 0%,
        rgba(184,201,190,.12) 100%
    );

    border:1px solid rgba(127,209,113,.20);

    border-radius:8px;

    padding:8px;

    transition:all .3s ease;

    position:relative;
    overflow:hidden;
}

.credential-card:hover{
    background:linear-gradient(
        135deg,
        rgba(205,255,181,.35) 0%,
        rgba(184,201,190,.18) 100%
    );

    border-color:#7FD171;

    transform:translateY(-3px);

    box-shadow:
        0 10px 24px rgba(127,209,113,.10);
}

/* 5 PILARES CARDS */
.framework-row{
    background:linear-gradient(
        135deg,
        rgba(3,14,1,.96) 0%,
        rgba(10,25,12,.92) 100%
    );

    border:1px solid rgba(127,209,113,.18);

    border-radius:0px 8px 8px 0px;

    padding:8px 12px;

    position:relative;
    overflow:hidden;
}
    
/* 5 PILARES CARDS - 2 */
.framework-row-2{
    background:linear-gradient(
        135deg,
        rgba(3,14,1,.96) 0%,
        rgba(10,25,12,.92) 100%
    );

    border:1px solid rgba(127,209,113,.18);

    border-radius:8px 0px 0px 8px;

    padding:8px 12px;

    position:relative;
    overflow:hidden;
}

.custom-image img{
    max-width:100%;
    height:auto !important;
}